<%--
  author: winkyle
  date: 2018/11/2
--%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
    <title>${department}${system} - 登录</title>
    <link rel="stylesheet" href="static/css/camera.css"/>
    <link rel="stylesheet" href="static/ace/css/font-awesome.css"/>
    <link rel="stylesheet" href="static/ace/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="static/css/login/login.css" />

</head>
<body>
<div style="width:100%;text-align: center;margin: 0 auto;position: absolute;">
    <!-- 登录 -->
    <div id="windows1">
        <div class="login_box" id="login_box">
            <form action="" method="post" name="loginForm">
                <div class="control-group normal_text">
                    <h3>
                        <img src="static/images/login/logo.png" alt="Logo" />
                    </h3>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <div class="main_input_box">
							<span class="add-on bg_lg">
							<i class="ace-icon fa fa-lg fa-user"></i>
							</span><input type="text" name="account" id="account" placeholder="请输入用户名" value="20181208232425OM"/>
                        </div>
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <div class="main_input_box">
							<span class="add-on bg_ly">
							<i class="ace-icon fa fa-lg fa-lock"></i>
							</span><input type="password" name="password" id="password" placeholder="请输入密码" value="123"/>
                        </div>
                    </div>
                </div>
                <div style="float:right;padding-right:14%;">
                    <div style="float: left;margin-top:3px;margin-right:2px;">
                        <font color="white">记住密码</font>
                    </div>
                    <div style="float: left;">
                        <input name="form-field-checkbox" id="rememberPassword" type="checkbox" style="padding-top:0px;"/>
                    </div>
                </div>
                <div class="form-actions">
                    <div style="width:86%;padding-left:8%;">
                        <div style="float: left;padding-top:2px;">
                            <i><img src="static/images/login/yan.png" /></i>
                        </div>
                        <div style="float: left;">
                            <input type="text" name="code" id="code"
                                   style="height:16px; width: 96px;padding-top:4px;" />
                        </div>
                        <div style="float: left; ">
                            <i><img style="height:22px;" id="codeImg" alt="点击更换" title="点击更换" src="" /></i>
                        </div>
                        <span class="pull-right"><a class="flip-link btn btn-info" id="login">登录</a></span>
                    </div>
                </div>
            </form>
            <div class="controls">
                <div class="main_input_box">
                    <font color="white"><span>版权 © 山东工商学院软工教研室</span></font>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="templatemo_banner_slide" class="container_wapper">
    <!-- 背景图片 -->
    <c:choose>
        <c:when test="${pageData.success}">
            <div class="camera_wrap camera_emboss" id="camera_slide">
                <c:forEach items="${pageData.data.backgroundImages}" var="var" varStatus="vs">
                    <div data-src="${var.imageAddress }"></div>
                </c:forEach>
            </div>
        </c:when>
        <c:otherwise>
            <div data-src="static/images/login/banner_slide_01.jpg"></div>
        </c:otherwise>
    </c:choose>
</div>
<!--jquery-->
<script src="static/js/jquery-1.7.2.js"></script>
<script src="static/js/jquery.tips.js"></script>
<script src="static/js/jquery.cookie.js"></script>
<script src="static/js/jquery.easing.1.3.js"></script>
<!--用于背景图更换的-->
<script src="static/js/camera.min.js"></script>
<script src="static/js/templatemo_script.js"></script>
<!--本系统自定义公共部分，文件里都有说明-->
<script src="static/js/common/format-tips.js"></script>
<script>

    //更新验证码
    function changeCode() {
        $("#codeImg").attr("src", "code/verification_code?time="+getTimestamp());
    }
    //登录数据校验;
    function checkFormats() {
        if(!checkFormat("#account",'帐号不得为空')) {
            showRockTiming();
            return false;
        }
        if(!checkFormat("#password",'密码不得为空')) {
            showRockTiming();
            return false;
        }
        if(!checkFormat("#code",'验证码不得为空')) {
            showRockTiming();
            return false;
        }
        return true;
    }
    //根据是否选择记住密码保存帐号密码
    function saveCookie() {
        if ($("#rememberPassword").prop("checked")) {
            //在cookie中保存account和password，有效期7天
            $.cookie('account', $("#account").val(), {expires : 7});
            $.cookie('password', $("#password").val(), {expires : 7});
        }
    }
    //dom加载完再执行
    $(document).ready(function() {
        //如果曾记住密码则显示
        var account = $.cookie('account');
        var password = $.cookie('password');
        if (typeof(account) != "undefined"
            && typeof(password) != "undefined") {
            $("#account").val(account);
            $("#password").val(password);
            $("#rememberPassword").attr("checked", true);
            $("#code").focus();
        }
        //先刷一个验证码，并绑定点击更新验证码事件
        changeCode();
        $("#codeImg").bind("click", changeCode);
        //登录
        $("#login").click(function () {
            if(checkFormats()){
                var data = {
                    account:$("#account").val(),
                    password:$("#password").val(),
                    code:$("#code").val(),
                    time:getTimestamp()
                }
                $.ajax({
                    type: "POST",
                    url: 'user/login',
                    data: data,
                    dataType:'json',
                    cache: false,
                    success: function(data){
                        if(data.success){
                            saveCookie();
                            window.location.href="menu/to_main/business";
                        }else{
                            changeCode();
                            showRockTiming();
                            tips("#login_box",1,data.msg,'#FF5080',5);
                        }
                    }
                });
            }
        });
        //回车登录事件
        $(document).keyup(function(event) {
            if (event.keyCode == 13) {
                $("#login").trigger("click");
            }
        });

    });
</script>
</body>

</html>
